<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="./static/fav.png">
    <title>EPassword Help</title>
    <link rel="stylesheet" href="./static/css/common.css">
    <link rel="stylesheet" href="./static/css/help.css">
</head>
<body>
    <!-- header -->
    <div class="app-header" >
        <div class="header-left">
            <a class="navbar-item" href="./index.html" id="password-link">Password</a>
            <a class="navbar-item" href="./bookmark.html" id="bookmark-link">Bookmark</a>
            <span class="navbar-item active">Help</span>
        </div>

        <div class="header-right">
            <div class="navbar-item"></div>
        </div>
    </div>

    <div class="navbar-placeholder"></div>

    <!-- main page -->
    <div class="help-main">
        <div class="container">
            <h3>Overview</h3>
            <p class="indent">
                The software use to save password and bookmark. <br/>
                Password Data Structor:  Company -> Project -> Item <br />
                Bookmark Data Structor:  Classify -> Group -> bookmark
            </p>

            <h3>Datasource</h3>
            <p class="indent">
                default datasource: <br/>
                1 for file:  &lt;root&gt;/core/static/js2 <br />
                2 for server: &lt;root&gt;/config/app.db <br />
                3 for tauri/electron: &lt;install directory&gt;/app.db <br />
                for 2 and 3, the datasource can be modify at: config.json, which is in the same directory of the app.db.
            </p>

            <h3>Content Syntax Support</h3>
            <div class="indent">
                1 markdown <br/>
                2 <a class="navbar-item" href="https://mermaid.js.org/syntax/flowchart.html" target="_blank">mermaid</a> example:
<pre>
    ```mermaid
    graph LR
    A[Square Rect] --> B(Round Rect)
    B --> C{Rhombus}
    C --> D[Callout]
    D --> E((Inner / Circle))
    E --> F{Rect with 
    Line Break}
    F --> G((Double Circle))
    ```
</pre>
                3 use ` ` to wrap password. example: 
<pre>
    `123456`
</pre>
</div>

            <h3>About Me</h3>
            <p class="indent">
                <span>If you have good ideas, please email: 95252845@qq.com</span>
                <span>gitee url: https://gitee.com/wuzhike403/epassword</span>
                <span style="margin-top: 5px;">If you like the product, please support it. Your support is the driving force for me to continue updating 😀</span>
                <span class="paycodes-wrap" style="margin-top: 20px;">
                    <img src="./static/images/wuji_wechat_paycode.jpg" alt="">
                    <img src="./static/images/wuji_zhi_paycode.jpg" alt="">
                </span>
            </p>
        </div>
    </div>
</body>
</html>
